@import '../custom.less';

@dropdown-prefix-cls: ~'@{css-prefix}dropdown-menu__item';

.@{dropdown-prefix-cls} {
  @apply list-none;
  @apply leading-8;
  @apply py-0 !px-4;
  @apply m-0;
  @apply text-xs;
  @apply text-color-text-primary;
  @apply cursor-pointer;
  @apply outline-0;

  &:focus,
  &:not(.is-disabled):hover {
    @apply bg-color-bg-4;
  }

  svg {
    margin-right: 5px;
    @apply ~'-mt-0.5';
  }

  &.is-disabled {
    @apply cursor-default;
    @apply text-color-text-disabled;
    @apply pointer-events-none;
  }
}

.@{dropdown-prefix-cls}--divided {
  @apply relative;
  @apply ~'mt-1.5';
  @apply border-t border-t-color-bg-2;

  &:before {
    @apply content-[''];
    @apply ~'h-1.5';
    @apply my-0 -mx-4;
    @apply block;
    @apply bg-color-bg-1;
  }
}
